<script setup lang="ts">
import dayjs from 'dayjs';
import { getSysImgUrl } from '/@/utils/index';
interface Props {
  /**
   * 工单事件列表
   */
  list: AppWoDeliver.eventDto[];
}

const props = withDefaults(defineProps<Props>(), {
  list: () => [],
});
</script>

<template>
  <view class="app-deliver-event-list">
    <view class="app-deliver-event-item" v-for="(item, index) in props.list" :key="item.id">
      <view class="app-deliver-event-item--left">
        <text class="app-deliver-event-item__time">
          {{ dayjs(item.handleTime).format('MM/DD HH:mm') }}
        </text>
      </view>
      <view class="app-deliver-event-item--center">
        <view class="app-deliver-event-item__dot"></view>
        <view v-if="index + 1 !== props.list.length" class="app-deliver-event-item__line"></view>
      </view>
      <view class="app-deliver-event-item--right">
        <view class="app-deliver-event-item__name">{{ item.eventName }}</view>
        <view v-if="item.eventCode === 'draft_task'">
          <text>创建人:&nbsp;&nbsp;</text>
          <text>{{ item.handleUserName }}</text>
        </view>
        <view v-if="item.eventCode === 'assign_task'">
          <text>派单人:&nbsp;&nbsp;</text>
          <text>{{ item.handleUserName }}</text>
        </view>
        <view v-if="item.eventCode === 'receive_task'">
          <text>接单人:&nbsp;&nbsp;</text>
          <text>{{ item.handleUserName }}</text>
        </view>
        <view v-if="item.eventCode === 'start_task'">
          <text>扫码地点:&nbsp;&nbsp;</text>
          <text>{{ item.qrcodeAreaName }}</text>
        </view>
        <view v-if="item.eventCode === 'end_task'">
          <text>扫码地点:&nbsp;&nbsp;</text>
          <text>{{ item.qrcodeAreaName }}</text>
        </view>
        <view v-if="item.handleDurationDesc">
          <text>处理时长:&nbsp;&nbsp;</text>
          <text>{{ item.handleDurationDesc }}</text>
        </view>
        <view
          v-if="
            item.eventCode === 'confirm_task' &&
            item.woDeliverEventFileDto &&
            item.woDeliverEventFileDto.length > 0
          "
        >
          <!--- 显示签名照片 -->
          <image
            :src="getSysImgUrl(item.woDeliverEventFileDto[0].fileUrl || '')"
            class="app-deliver-event-item__image"
            mode="aspectFill"
          />
        </view>
      </view>
    </view>
  </view>
</template>

<style lang="scss">
@import './index.scss';
</style>
